<template>
    <view>
        <view class="back_big_box" :class="isBg ? 'back_big_box_bg' : ''">
            <view style="height: 88rpx;"></view>
            <view class="title_icon_box">
                <view class="back_icon" v-if="isBack == true">
                    <u-icon v-if="backSty != 1" @click="goback" name="arrow-left" :color="titleIconColor"
                        size="50"></u-icon>
                    <u-icon v-else @click="goback" name="close" color="rgba(128, 128, 128, 1)" size="34"></u-icon>
                </view>
                <view class="back_title_box" :style="{ color: titleIconColor }" :color="titleIconColor">{{ title }}
                </view>
            </view>
        </view>
    </view>
</template>
<script>
export default {
    //  title:页面标题
    // isBack：返回按键 需要传true 默认不显示
    // titleIconColor 图标/文字颜色 默认黑色
    // isBg：背景 需要传true 默认显示白色
    props: {
        title: {
            type: String,
            default: ''
        },
        isBack: {
            type: Boolean,
            default: false
        },
        isBg: {
            type: Boolean,
            default: true
        },
        backSty: {
            type: Number,
            default: 2
        },
        titleIconColor: {
            type: String,
            default: 'rgba(0, 0, 0, 1)'
        },
    },
    data() {
        return {

        }
    },
    onShow() {
    },
    methods: {
        goback() {
            if (uni.getStorageSync('back') == 2) {
                uni.navigateBack({
                    default: 2
                })
                uni.setStorageSync('back', 1)
            } else {
                uni.navigateBack()
            }
        },
    }
}
</script>
<style lang="scss">
.back_big_box {
    width: 750rpx;
    height: 176rpx;
    opacity: 1;

    &.back_big_box_bg {
        background-color: rgba(255, 255, 255, 1);
    }

    .title_icon_box {
        width: 100%;
        height: calc(176rpx - 88rpx);
        position: relative;

        .back_icon {
            position: absolute;
            left: 36rpx;
            top: 20rpx;
            width: 50rpx;
            height: 50rpx;
            line-height: 36rpx;
        }

        .back_title_box {
            text-align: center;
            width: 100%;
            height: 52rpx;
            opacity: 1;
            /** 文本1 */
            font-size: 36rpx;
            font-weight: 600;
            letter-spacing: 0rpx;
            line-height: 80rpx;

        }
    }

}
</style>